doctype html
html
  head
    link(rel='stylesheet', href='css/graph-creator.css')
    link(rel='stylesheet', href='css/tesis.css')
    link(rel='stylesheet', href='vendor/introjs/introjs.min.css')
    link(rel='stylesheet', href='vendor/nprogress/nprogress.css')
    title= title
  body
    #menu
      #handle
      #autohandle
      .divscroll
        p
          select#plantillaPrograma.form-control.input
        ul#opciones
        ul#mopciones
    #back
      a(href="/user") < Ir atras
    #toolbox
      input#hidden-file-upload(type='file')
      input#upload-input(type='image', title='Subir', src='images/upload.png', alt='upload graph')
      input#run-input(type='image', title='Ejecutar', src='images/run.png', alt='run graph')
      input#save-input(type='image', title='Guardar', src='images/save.png', alt='save graph')
      input#download-input(type='image', title='Descargar', src='images/download.png', alt='download graph')
      input#delete-graph(type='image', title='Borrar', src='images/trash.png', alt='delete graph')
      input#openMenu(type='image', title='Menu', src='images/menu.png', alt='menu')
      input#doc(type='image', title='Doc', src='images/doc.png', alt='documentation')

    #cmdModal.modal.fade(role='dialog')
      .modal-dialog
        .modal-content
          .modal-header
            button.close(type='button', data-dismiss='modal') ×
            h4.modal-title Comand
          .modal-body
            p#cmd
          .modal-footer
            button.btn.btn-default(type='button', data-dismiss='modal') Cerrar

    // block modals
    #filem.modal.bs-example-modal-lg(tabindex='-1', role='dialog', aria-labelledby='myLargeModalLabel', aria-hidden='true')
      .modal-dialog.modal-lg
        .modal-content
          .modal-content
            .modal-header
                div
                  ul#pestanas.nav.nav-tabs(role='tablist')
                    li.active(role='presentation')
                      a(href='#home2', aria-controls='home2', role='tab', data-toggle='tab') Seleccionar
                    li(role='presentation')
                      a(href='#profile2', aria-controls='profile2', role='tab', data-toggle='tab') Indicar
                    li(role='presentation')
            .modal-body
                div
                  .tab-content
                    #home2.tab-pane.active(role='tabpanel')
                        div(ng-app='FileManagerApp')
                            angular-filemanager
                    #profile2.tab-pane(role='tabpanel')
                        .container
                            .form-group
                                label(for='inputFile') Indique los archivos (Separados por comas)
                                input#archivos.form-control(type='text', placeholder='Archivos')

            .modal-footer
                button.btn(data-dismiss='modal', aria-hidden='true') Cancelar
                button#filemB.btn.btn-primary Seleccionar

    script(src='vendor/d3.v3.js', charset='utf-8')
    script(src='vendor/FileSaver.min.js')
    script(type='text/javascript', src='vendor/jquery/jquery-1.11.3.min.js')
    script(type='text/javascript', src='js/filelistener.js')
    script(type='text/javascript').
      proyecto= "#{proyecto}";
      nodes= !{nodes} || [];
      edgesTpm= !{edges};
      ejecucion = null;
      var workloaders = ["htcondor","openlava", "torque", "slurm"];
      workloader = "#{workloader}"  || workloaders[0];

      edges = [];

      function buscar(id){
        for(var i=0; i<nodes.length; i++){
            if(nodes[i].id== id){
                return i;
            }
        }
        return -1;
      }
      if (edgesTpm){
          for(var j = 0 ; j< edgesTpm.length; j++){
            edges.push({source : nodes[buscar(edgesTpm[j].source.id)], target : nodes[buscar(edgesTpm[j].target.id)]});
          }
      }
      fileListener = new FileListener();
    script(src='js/khanalg.js')
    script(src='vendor/dagre.min.js')
    script(src='vendor/nprogress/nprogress.js')
    script(src='js/sortgraph.js')
    script(src='js/graph-creator.js')
    script(src='vendor/async.min.js')
    script(src='js/r.js')
    script(src='renderer.js')
    script(src='vendor/introjs/intro.min.js')

// third party
script(src='vendor/saveSvgAsPng.js')
script(src='vendor/angular-filemanager/bower_components/angular/angular.min.js')
script(src='vendor/angular-filemanager/bower_components/angular-translate/angular-translate.min.js')
script(src='vendor/angular-filemanager/bower_components/jquery/dist/jquery.min.js')
script(src='vendor/angular-filemanager/bower_components/bootstrap/dist/js/bootstrap.min.js')
link(rel='stylesheet', href='vendor/angular-filemanager/bower_components/bootswatch/paper/bootstrap.min.css')
script(src='vendor/angular-filemanager/src/js/app.js')
script(src='vendor/bootstrap-notify/bootstrap-notify.min.js')
script(src='vendor/angular-filemanager/src/js/directives/directives.js')
script(src='vendor/angular-filemanager/src/js/filters/filters.js')
script(src='vendor/angular-filemanager/src/js/providers/config.js')
script(src='vendor/angular-filemanager/src/js/entities/chmod.js')
script(src='vendor/angular-filemanager/src/js/entities/item.js')
script(src='vendor/angular-filemanager/src/js/services/apihandler.js')
script(src='vendor/angular-filemanager/src/js/services/apimiddleware.js')
script(src='vendor/angular-filemanager/src/js/services/filenavigator.js')
script(src='vendor/angular-filemanager/src/js/providers/translations.js')
script(src='vendor/angular-filemanager/src/js/controllers/main.js')
script(src='vendor/angular-filemanager/src/js/controllers/selector-controller.js')
link(href='vendor/angular-filemanager/src/css/animations.css', rel='stylesheet')
link(href='vendor/angular-filemanager/src/css/dialogs.css', rel='stylesheet')
link(href='vendor/angular-filemanager/src/css/main.css', rel='stylesheet')
script(type='text/javascript').
  angular.module('FileManagerApp').config(['fileManagerConfigProvider', function (config) {
  var defaults = config.$get();
  config.set({
  appName: 'Nada de Nada',
  allowedActions: angular.extend(defaults.allowedActions, {
  copy: false, // <--- MMM
  changePermissions: false,
  compress: false,
  compressChooseName: false,
  extract: false, // <--- MMM
  //downloadMultiple: false, // <--- MMM
  }),
  multipleDownloadFileName: 'Comprimido.rar',
  defaultLang: "es",
  listUrl: "/listar",
  getContentUrl:"/listar",
  createFolderUrl:"/crearCarpeta",
  uploadUrl:"/crearArchivos",
  renameUrl:"/editarArchivo",
  moveUrl: '/editarArchivo',
  removeUrl: '/eliminarArchivo',
  editUrl: '/editarArchivo',
  downloadFileUrl: '/descargarArchivo',
  getContentUrl: '/contenidoArchivo',
  tplPath: 'vendor/angular-filemanager/src/templates'
  });
  }]);
// block jsinc
script(type='text/javascript').
  showTutorial= !{showTutorial};
  function startIntro(){
    var intro = introJs();
      intro.setOptions({
        steps: [
          {
            intro: "Welcome to Uchuva, lets create a workflow!"
          },
          {
            intro: "Press Shift + Click in the canvas and add a Node (Add all the nodes you want)"
          },
          {
            intro: "Press Shift and drag from a node to another in order to create an edge",
            position: 'right'
          },
          {
            element: document.querySelector('#openMenu'),
            intro: 'Select a Node and choose, in the side menu, a software to execute by editing the values.',
            position: 'top'
          },
          {
            element: document.querySelector('#save-input'),
            intro: "When you finish editing your dag, click in the save button",
            position: 'top'
          },
          {
            element: document.querySelector('#run-input'),
            intro: 'When you finish editing your dag, click in the run button.',
            position: 'top'
          }
        ]
      });
      intro.onchange(function(element) {
         console.log('hint clicked', element);
      });
      intro.start();
    }
    if(showTutorial)
      startIntro()